<template>
    <div class="participant wrap-table satisfation-table">
        <el-form ref="form" :model="searchData" label-width="100px" class="clearfix flex-div">
            <el-form-item label="填写日期"  label-width="70px" class=""  style="width:350px">
                <div class="block">
                    <el-date-picker
                            v-model="timeDate"
                            type="daterange"
                            align="right"
                            unlink-panels
                            range-separator="至"
                            value-format="yyyy-MM-dd"
                            start-placeholder="开始日期"
                            end-placeholder="结束日期"
                            :picker-options="pickerOptions">
                    </el-date-picker>
                </div>
            </el-form-item>
            <el-form-item label="所在地区" class=" item-right" style="width:210px">
                <el-select v-model="searchData.districtNo" placeholder="请选择"  clearable>
                    <el-option
                            v-for="item in optionDiq"
                            :key="item.DistrictName"
                            :label="item.DistrictName"
                            :value="item.DistrictNo">
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="试验类型" class=" item-right" style="width:240px">
                <el-select v-model="searchData.testType" clearable placeholder="请选择">
                    <el-option
                            v-for="item in options6"
                            :key="item.value+Math.random()"
                            :label="item.label"
                            :value="item.value">
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="综合评价" class=" item-right" style="width:240px">
                <el-select v-model="searchData.satisfation" clearable placeholder="请选择">
                    <el-option
                            v-for="item in options9"
                            :key="item.value+Math.random()"
                            :label="item.label"
                            :value="item.value">
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="填写状态" class=" item-right" style="width: 190px;">
                <el-select v-model="searchData.fillInState" clearable placeholder="请选择">
                    <el-option label="已填写" value="1"></el-option>
                    <el-option label="未填写" value="2"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="" class="" label-width="30px">
                <el-input v-model="searchData.key" style="width: 220px;" placeholder="手机号、研究编号、姓名首字母">
                </el-input>
            </el-form-item>
            <!-- 操作区域 -->
            <div class="flex-r-but">
                <el-button @click="searchHandler" type="primary" class="pd-lr30">查询</el-button>
            </div>
        </el-form>
        <!---->
        <el-tabs v-model="activeName" @tab-click="handleClick">
            <el-tab-pane label="第一次见面" name="zero">
                <template>
                    <el-table
                            :data="tableData"
                            border
                            id="out-table"
                            v-loading="loading"
                            @expand-change="expandChange"
                            element-loading-text="加载中"
                            style="width: 100%;margin-top: 20px;">
                        <!--展开行效果-->
                        <el-table-column
                                align="center"
                                border="none"
                                fixed="left"
                                type="expand"
                                min-width="120">
                            <template slot-scope="props" >  <!--展开行内容-->
                                <el-table border v-if="props.row.FillInTime" :data="props.row.expand" class="noneHightable" :highlight-current-row="false" style="width:65%;margin:0 19%" >
                                    <el-table-column label="第一次见面满意度调查" prop="Question" align="left" header-align="center"  :show-overflow-tooltip="true">

                                    </el-table-column>
                                    <el-table-column label="满意度" prop="Satisfation" align="center" width="100px">
                                        <template slot-scope="scope">
                                            <img v-if="scope.row.Satisfation" class="iconImg" :src="srcImgfilter(scope.row.Satisfation)" alt=""/>
                                        </template>
                                    </el-table-column>
                                    <el-table-column label="意见与建议" prop="Advice" align="center">

                                    </el-table-column>
                                </el-table>
                                <p v-else style="text-align: center">暂无调查反馈</p>
                            </template>
                        </el-table-column>
                        <el-table-column
                                prop="MeetingDate"
                                align="center"
                                label="见面日期"
                                min-width="120">
                        </el-table-column>
                        <el-table-column
                                prop="FillInTime"
                                :show-overflow-tooltip="true"
                                :formatter="FillInTimeFilter"
                                label="填写时间"
                                align="center"
                                min-width="140">
                        </el-table-column>
                        <el-table-column
                                prop="Satisfation"
                                :label="SatisfationLabel"
                                align="center"
                                min-width="160">
                            <template slot-scope="scope">
                                <img v-if="scope.row.Satisfation" class="iconImg" :src="srcImgfilter(scope.row.Satisfation)" alt=""/>
                            </template>
                        </el-table-column>
                        <el-table-column
                                prop="Surname"
                                label="姓名首字母"
                                align="center"
                                min-width="120">
                        </el-table-column>
                        <el-table-column
                                label="手机号"
                                align="center"
                                min-width="120">
                            <template slot-scope="scope">
                                <el-tooltip :content="scope.row.Mobile" placement="top">
                                    <span class="click_line" @click="JumpUserinfo(scope.row)">{{scope.row.Mobile |mobileFilter}}</span>
                                </el-tooltip>
                            </template>
                        </el-table-column>
                        <el-table-column
                                prop="ResearchNo"
                                label="研究编号"
                                align="center"
                                min-width="100">
                        </el-table-column>
                        <el-table-column
                                prop="GroupType"
                                label="研究组别"
                                :formatter="GroupTypeFilter"
                                align="center"
                                min-width="100">
                        </el-table-column>
                        <el-table-column
                                prop="InPeriod"
                                label="入组时研究阶段"
                                :formatter="PeriodFilter"
                                align="center"
                                min-width="120">
                        </el-table-column>
                        <el-table-column
                                prop="InIntensityOfIntervention"
                                label="入组时干预强度"
                                :formatter="IntensityFilter"
                                align="center"
                                min-width="140">
                        </el-table-column>

                    </el-table>
                </template>
            </el-tab-pane>
            <el-tab-pane label="健康访谈" name="first">
                <template>
                    <el-table
                            :data="tableData"
                            border
                            id="out-table"
                            v-loading="loading"
                            @expand-change="expandChange"
                            element-loading-text="加载中"
                            style="width: 100%;margin-top: 20px;">
                        <!--展开行效果-->
                        <el-table-column
                                align="center"
                                border="none"
                                fixed="left"
                                type="expand"
                                min-width="120">
                            <template slot-scope="props">  <!--展开行内容-->
                                <el-table border v-if="props.row.FillInTime" :data="props.row.expand" class="noneHightable" :highlight-current-row="false" style="width:65%;margin:0 19%" >
                                    <el-table-column label="健康访谈满意度调查" prop="Question" align="left" header-align="center"  :show-overflow-tooltip="true">

                                    </el-table-column>
                                    <el-table-column label="满意度" prop="Satisfation" align="center" width="100px">
                                        <template slot-scope="scope">
                                            <img v-if="scope.row.Satisfation" class="iconImg" :src="srcImgfilter(scope.row.Satisfation)" alt=""/>
                                        </template>
                                    </el-table-column>
                                    <el-table-column label="意见与建议" prop="Advice" align="center">

                                    </el-table-column>
                                </el-table>
                                <p v-else style="text-align: center">暂无调查反馈</p>
                            </template>
                        </el-table-column>
                        <el-table-column
                                :prop="FollowUpDate"
                                align="center"
                                :label="FollowUpDateLabel"
                                min-width="120">
                        </el-table-column>
                        <el-table-column
                                :prop="FollowUpTime"
                                :label="FollowUpTimeLabel"
                                align="center"
                                min-width="100">
                        </el-table-column>
                        <el-table-column
                                prop="ScheduleName"
                                label="事项标题"
                                :show-overflow-tooltip="true"
                                align="center"
                                min-width="180">
                        </el-table-column>
                        <el-table-column
                                prop="FollowUpType"
                                label="访谈类型"
                                :formatter="FollowUpTypeFilter"
                                align="center"
                                min-width="100">
                        </el-table-column>
                        <el-table-column
                                prop="Nurse"
                                :label="NurseLabel"
                                align="center"
                                min-width="100">
                        </el-table-column>
                        <el-table-column
                                prop="FillInTime"
                                :show-overflow-tooltip="true"
                                label="填写时间"
                                align="center"
                                min-width="140">
                        </el-table-column>
                        <el-table-column
                                prop="Satisfation"
                                label="对访谈的整体评价"
                                align="center"
                                min-width="160">
                            <template slot-scope="scope">
                                <img v-if="scope.row.Satisfation" class="iconImg" :src="srcImgfilter(scope.row.Satisfation)" alt=""/>
                            </template>
                        </el-table-column>
                        <el-table-column
                                prop="Surname"
                                label="姓名首字母"
                                align="center"
                                min-width="120">
                        </el-table-column>
                        <el-table-column
                                label="手机号"
                                align="center"
                                min-width="110">
                            <template slot-scope="scope">

                                <el-tooltip :content="scope.row.Mobile" placement="top">
                                    <span class="click_line" @click="JumpUserinfo(scope.row)">{{scope.row.Mobile |mobileFilter}}</span>
                                </el-tooltip>
                            </template>
                        </el-table-column>
                        <el-table-column
                                prop="Period"
                                label="研究阶段"
                                :formatter="PeriodFilter"
                                align="center"
                                min-width="110">
                        </el-table-column>
                        <el-table-column
                                prop="ResearchNo"
                                label="研究编号"
                                align="center"
                                min-width="100">
                        </el-table-column>
                        <el-table-column
                                prop="IntensityOfIntervention"
                                label="干预强度"
                                :formatter="IntensityFilter"
                                align="center"
                                min-width="100">
                        </el-table-column>

                    </el-table>
                </template>
            </el-tab-pane>
            <el-tab-pane label="营养咨询" name="second">
                <template>
                    <el-table
                            :data="tableData"
                            border
                            id="out-table"
                            v-loading="loading"
                            @expand-change="expandChange"
                            element-loading-text="加载中"
                            style="width: 100%;margin-top: 20px;">
                        <!--展开行效果-->
                        <el-table-column
                                align="center"
                                border="none"
                                fixed="left"
                                type="expand"
                                min-width="120">
                            <template slot-scope="props">  <!--展开行内容-->
                                <el-table border v-if="props.row.FillInTime" :data="props.row.expand" class="noneHightable" :highlight-current-row="false" style="width:65%;margin:0 19%" >
                                    <el-table-column label="营养咨询满意度调查" prop="Question" align="left" header-align="center"  :show-overflow-tooltip="true">

                                    </el-table-column>
                                    <el-table-column label="满意度" prop="Satisfation" align="center" width="100px">
                                        <template slot-scope="scope">
                                            <img v-if="scope.row.Satisfation" class="iconImg" :src="srcImgfilter(scope.row.Satisfation)" alt=""/>
                                        </template>
                                    </el-table-column>
                                    <el-table-column label="意见与建议" prop="Advice" align="center">

                                    </el-table-column>
                                </el-table>
                                <p v-else style="text-align: center">暂无调查反馈</p>
                            </template>
                        </el-table-column>
                        <el-table-column
                                :prop="FollowUpDate"
                                align="center"
                                :label="FollowUpDateLabel"
                                min-width="120">
                        </el-table-column>
                        <el-table-column
                                :prop="FollowUpTime"
                                :label="FollowUpTimeLabel"
                                align="center"
                                min-width="120">
                        </el-table-column>
                        <el-table-column
                                prop="ScheduleName"
                                label="事项标题"
                                :show-overflow-tooltip="true"
                                align="center"
                                min-width="180">
                        </el-table-column>
                        <el-table-column
                                prop="Nurse"
                                :label="NurseLabel"
                                align="center"
                                min-width="100">
                        </el-table-column>
                        <el-table-column
                                prop="FillInTime"
                                :show-overflow-tooltip="true"
                                label="填写时间"
                                align="center"
                                min-width="140">
                        </el-table-column>
                        <el-table-column
                                prop="Satisfation"
                                :label="SatisfationLabel"
                                align="center"
                                min-width="130">
                            <template slot-scope="scope">
                                <img v-if="scope.row.Satisfation" class="iconImg" :src="srcImgfilter(scope.row.Satisfation)" alt=""/>
                            </template>
                        </el-table-column>
                        <el-table-column
                                prop="Surname"
                                label="姓名首字母"
                                align="center"
                                min-width="120">
                        </el-table-column>
                        <el-table-column
                                label="手机号"
                                align="center"
                                min-width="120">
                            <template slot-scope="scope">

                                <el-tooltip :content="scope.row.Mobile" placement="top">
                                    <span class="click_line" @click="JumpUserinfo(scope.row)">{{scope.row.Mobile |mobileFilter}}</span>
                                </el-tooltip>
                            </template>
                        </el-table-column>
                        <el-table-column
                                prop="Period"
                                label="研究阶段"
                                :formatter="PeriodFilter"
                                align="center"
                                min-width="120">
                        </el-table-column>
                        <el-table-column
                                prop="ResearchNo"
                                label="研究编号"
                                align="center"
                                min-width="100">
                        </el-table-column>
                        <el-table-column
                                prop="IntensityOfIntervention"
                                label="干预强度"
                                :formatter="IntensityFilter"
                                align="center"
                                min-width="100">
                        </el-table-column>

                    </el-table>
                </template>
            </el-tab-pane>
            <el-tab-pane label="健康教育课" name="third">
                <template>
                    <el-table
                            :data="tableData"
                            border
                            id="out-table"
                            v-loading="loading"
                            @expand-change="expandChange"
                            element-loading-text="加载中"
                            style="width: 100%;margin-top: 20px;">
                        <!--展开行效果-->
                        <el-table-column
                                align="center"
                                border="none"
                                fixed="left"
                                type="expand"
                                min-width="120">
                            <template slot-scope="props">  <!--展开行内容-->
                                <el-table border v-if="props.row.FillInTime" :data="props.row.expand" class="noneHightable" :highlight-current-row="false" style="width:65%;margin:0 19%" >
                                    <el-table-column label="健康教育满意度调查" prop="Question" align="left" header-align="center"  :show-overflow-tooltip="true">

                                    </el-table-column>
                                    <el-table-column label="满意度" prop="Satisfation" align="center" width="100px">
                                        <template slot-scope="scope">
                                            <img v-if="scope.row.Satisfation" class="iconImg" :src="srcImgfilter(scope.row.Satisfation)" alt=""/>
                                        </template>
                                    </el-table-column>
                                    <el-table-column label="意见与建议" prop="Advice" align="center">

                                    </el-table-column>
                                </el-table>
                                <p v-else style="text-align: center">暂无调查反馈</p>
                            </template>
                        </el-table-column>
                        <el-table-column
                                :prop="FollowUpDate"
                                align="center"
                                :label="FollowUpDateLabel"
                                min-width="120">
                        </el-table-column>
                        <el-table-column
                                :prop="FollowUpTime"
                                :label="FollowUpTimeLabel"
                                align="center"
                                min-width="120">
                        </el-table-column>
                        <el-table-column
                                prop="ScheduleName"
                                label="事项标题"
                                :show-overflow-tooltip="true"
                                align="center"
                                min-width="180">
                        </el-table-column>
                        <el-table-column
                                prop="FillInTime"
                                :show-overflow-tooltip="true"
                                label="填写时间"
                                align="center"
                                min-width="140">
                        </el-table-column>
                        <el-table-column
                                prop="Satisfation"
                                :label="SatisfationLabel"
                                align="center"
                                min-width="130">
                            <template slot-scope="scope">
                                <img v-if="scope.row.Satisfation" class="iconImg" :src="srcImgfilter(scope.row.Satisfation)" alt=""/>
                            </template>
                        </el-table-column>
                        <el-table-column
                                prop="Surname"
                                label="姓名首字母"
                                align="center"
                                min-width="120">
                        </el-table-column>
                        <el-table-column
                                label="手机号"
                                align="center"
                                min-width="120">
                            <template slot-scope="scope">

                                <el-tooltip :content="scope.row.Mobile" placement="top">
                                    <span class="click_line" @click="JumpUserinfo(scope.row)">{{scope.row.Mobile |mobileFilter}}</span>
                                </el-tooltip>
                            </template>
                        </el-table-column>
                        <el-table-column
                                prop="Period"
                                label="研究阶段"
                                :formatter="PeriodFilter"
                                align="center"
                                min-width="120">
                        </el-table-column>
                        <el-table-column
                                prop="ResearchNo"
                                label="研究编号"
                                align="center"
                                min-width="100">
                        </el-table-column>

                        <el-table-column
                                prop="IntensityOfIntervention"
                                label="干预强度"
                                :formatter="IntensityFilter"
                                align="center"
                                min-width="100">
                        </el-table-column>

                    </el-table>
                </template>
            </el-tab-pane>
            <el-tab-pane label= "母乳喂养门诊" name= "fourth">
                <template>
                    <el-table
                            :data="tableData"
                            border
                            id="out-table"
                            v-loading="loading"
                            @expand-change="expandChange"
                            element-loading-text="加载中"
                            style="width: 100%;margin-top: 20px;">
                        <!--展开行效果-->
                        <el-table-column
                                align="center"
                                border="none"
                                fixed="left"
                                type="expand"
                                min-width="120">
                            <template slot-scope="props">  <!--展开行内容-->
                                <el-table border v-if="props.row.FillInTime" :data="props.row.expand" class="noneHightable" :highlight-current-row="false" style="width:65%;margin:0 19%" >
                                    <el-table-column label="健康教育满意度调查" prop="Question" align="left" header-align="center"  :show-overflow-tooltip="true">

                                    </el-table-column>
                                    <el-table-column label="满意度" prop="Satisfation" align="center" width="100px">
                                        <template slot-scope="scope">
                                            <img v-if="scope.row.Satisfation" class="iconImg" :src="srcImgfilter(scope.row.Satisfation)" alt=""/>
                                        </template>
                                    </el-table-column>
                                    <el-table-column label="意见与建议" prop="Advice" align="center">

                                    </el-table-column>
                                </el-table>
                                <p v-else style="text-align: center">暂无调查反馈</p>
                            </template>
                        </el-table-column>
                        <el-table-column
                                prop="VisitDate"
                                align="center"
                                label="门诊时间"
                                min-width="120">
                        </el-table-column>
                        <el-table-column
                                prop="VisitStartTime"
                                label="开始时间"
                                align="center"
                                min-width="90">
                        </el-table-column>
                        <el-table-column
                                prop="Nurse"
                                label="哺乳顾问"
                                :show-overflow-tooltip="true"
                                align="center"
                                min-width="90">
                        </el-table-column>
                        <el-table-column
                                prop="Surname"
                                label="姓名首字母"
                                align="center"
                                min-width="120">
                        </el-table-column>
                        <el-table-column
                                label="手机号"
                                align="center"
                                min-width="120">
                            <template slot-scope="scope">
                                <el-tooltip :content="scope.row.Mobile" placement="top">
                                    <span class="click_line" @click="JumpUserinfo(scope.row)">{{scope.row.Mobile |mobileFilter}}</span>
                                </el-tooltip>
                            </template>
                        </el-table-column>
                        <el-table-column
                                prop="ResearchNo"
                                label="研究编号"
                                align="center"
                                min-width="100">
                        </el-table-column>

                        <el-table-column
                                prop="Satisfation"
                                label="咨询总体评价"
                                align="center"
                                min-width="130">
                            <template slot-scope="scope">
                                <img v-if="scope.row.Satisfation" class="iconImg" :src="srcImgfilter(scope.row.Satisfation)" alt=""/>
                            </template>
                        </el-table-column>
                        <el-table-column
                                prop="FillInTime"
                                :show-overflow-tooltip="true"
                                label="填写时间"
                                align="center"
                                min-width="140">
                        </el-table-column>
                        <el-table-column
                                prop="DistrictName"
                                label="所在地区"
                                align="center"
                                min-width="100">
                        </el-table-column>
                        <el-table-column
                                prop="VisitPeriod"
                                label="门诊时研究阶段"
                                :formatter="PeriodFilter"
                                align="center"
                                min-width="140">
                        </el-table-column>
                        <el-table-column
                                prop="VisitIntensityOfIntervention"
                                label="门诊时干预强度"
                                :formatter="IntensityFilter"
                                align="center"
                                min-width="140">
                        </el-table-column>

                    </el-table>
                </template>
            </el-tab-pane>
        </el-tabs>

        <!--分页-->
        <div class="block mg-20-auto ">
            <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page.sync="pageId"
                    :page-sizes="[10, 20, 30, 40]"
                    :page-size="pageSize"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="total">
            </el-pagination>
        </div>
        <!---->
    </div>

</template>
<script>
import {DIC_PERIODA,filterPeriod} from '@/utils/localDic'
export default {
    data() {
        return {
            searchData:{
                key:'',
                districtNo:'',
                fillInState:'',
	            testType:'2',
	            satisfation:''
            },
            activeName: 'zero',
            changeIndex:'0',
            changeObj:{},
            timeDate:[],
            pickerOptions: {
                shortcuts: [{
                    text: '最近一周',
                    onClick(picker) {
                        const end = new Date();
                        const start = new Date();
                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
                        picker.$emit('pick', [start, end]);
                    }
                }, {
                text: '最近一个月',
                    onClick(picker) {
                        const end = new Date();
                        const start = new Date();
                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
                        picker.$emit('pick', [start, end]);
                    }
                }, {
                text: '最近三个月',
                     onClick(picker) {
                        const end = new Date();
                        const start = new Date();
                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
                        picker.$emit('pick', [start, end]);
                    }
                }],
            },
            IntensityFilter(row, column, cellValue, index){
                return cellValue==1?'AA':cellValue==2?'A':'-'
            },
            pageId:1,
            total:null,
            loading:true,
            pageSize:10,
            tableData:[0,0],
            maxHeight:'',
            satisfactionType:'4',
            FollowUpTypeFilter(row, column, cellValue, index){
                return cellValue==1?'面对面':'电话'
            },
            PeriodFilter(row, column, cellValue, index){
                return filterPeriod(cellValue)
            },
            GroupTypeFilter(row, column, cellValue, index){
                return cellValue=='1'?'A':cellValue=='2'?'B':'-'
            },
            FillInTimeFilter(row, column, cellValue, index){
                if(cellValue){
                    return cellValue.substring(0,16)
                }
            },
            optionDiq:[],
	        options9:[{value:'',label:'全部'},{value:'3',label:'满意'},{value:'2',label:'一般'},{value:'1',label:'不满意'}],
	        options6: [{value: '', label: '全部'},{value: '0', label: '预试验'},{value: '1', label: '正式试验'},{value: '2', label: '预试验+正式试验'}],
            SatisfationLabel:'首次见面整体印象',
            FollowUpDate:'FollowUpDate',
            FollowUpDateLabel:'见面日期',
            FollowUpTime:'FollowUpTime',
            FollowUpTimeLabel:'访谈时间',
            NurseLabel:'访谈人员'
        }
    },
    beforeMount:function() {
        let that=this;
        let appHeight=$(window).height();
        let autoheight=(appHeight-250)+'px'
        that.maxHeight=autoheight
    },
    created() {

    },
    filters:{
        mobileFilter(cellValue) {
            if(cellValue){
                return cellValue.replace(/(\d{3})\d{4}(\d{4})/, "$1****$2");
            }
        },
    },
    methods: {
        GetCommunityDistrict:function(){    //获取社区行政区
            let that = this;
            that.service({
                url: "/Dic/GetCommunityDistrict",
                method: "get",
                params: {
                }
            }).then(response => {
                that.optionDiq=response.dtData;
            })
            .catch(data => {

            });
        },
        JumpUserinfo:function(row){
            let that=this;
            that.$router.push({
                path:'/participant/editor',
                query:{
                    id:row.ResearchObjectId,
                    mobile:row.Mobile,
                    researchNo:row.ResearchNo,
                }
            })
        },
        handleClick(tab, event) {   //切换tab
            let index=parseInt(tab.index)
            // index==0?index=4:index=index

            switch(tab.index) {
              case '0':
                index = '4';
                break;
              case '1':
                index = '1';
                break;
              case '2':
                index = '2';
                break;
              case '3':
                index = '3';
                break;
              case '4':
                index = '5';
                break;
            }

            this.pageId=1;
            this.pageSize=10;
            this.total=null;
            this.satisfactionType=index
            let arr1=['首次见面整体印象','咨询整体评价','总体评价','首次见面整体印象','首次见面整体印象']
            let arr2=[
                {
                    name1:'访谈日期',
                    prop1:'FollowUpDate',
                    name2:'访谈时间',
                    prop2:'FollowUpTime',
                },
                {
                    name1:'就诊日期',
                    prop1:'VisitDate',
                    name2:'就诊时间',
                    prop2:'VisitTime',
                },
                {
                    name1:'上课日期',
                    prop1:'LessonDate',
                    name2:'上课时间',
                    prop2:'LessonTime',

                },
                {
                    name1:'见面日期',
                    prop1:'MeetingDate',
                    name2:'',
                    prop2:'',
                },{
                    name1:'门诊时间',
                    prop1:'MeetingDate',
                    name2:'',
                    prop2:'',
                }
            ]
            let arr3=['访谈人员','营养师','','']
            this.NurseLabel=arr3[index-1]
            this.SatisfationLabel=arr1[index-1];
            this.FollowUpDate=arr2[index-1].prop1;
            this.FollowUpDateLabel=arr2[index-1].name1;
            this.FollowUpTime=arr2[index-1].prop2;
            this.FollowUpTimeLabel=arr2[index-1].name2;       //合并在一起得table，由于组件单元框错位有问题，又分开了。。。。
            this.getList()
        },
        expandChange:function(row,expands){
            let that=this;
            if(!row.expand){
                that.service({
                    url:'/ResearchObject/GetSatisfactionDetail',
                    method:'get',
                    params:{
                        satisfactionId:row.SYS_ID
                    }
                }).then(response=>{
                    row.expand=response.dtData;
                }).catch(data=>{
                })
            }
        },
        srcImgfilter:function(index){
            let src=''
            index=='1'?src='./static/img/icon_sad_celected@2x.png':index=='2'?src='./static/img/icon_ok_celected@2x.png':index=='3'?src='./static/img/icon_happy_celected@2x.png':src='';
            return src
        },
        searchHandler:function(){   //查询
            this.pageId=1;
            this.pageSize=10;
            this.total=null;
            this.getList()
        },
        handleSizeChange(val) {       //条数改变
            this.pageSize=val;
            this.getList()
        },
        handleCurrentChange(val) {    //页数改变
            this.pageId = val
            this.getList()
        },
        getList:function(){           //获取一级信息列表
            let that=this
            that.loading=true
            that.service({
                url:'/ResearchObject/GetSatisfaction',
                method:'get',
                params:{
                    pageCount:(that.pageId-1),
                    pageSize:that.pageSize,
                    satisfactionType:that.satisfactionType,
                    ...that.searchData,
                    startDate:that.timeDate?that.timeDate[0]:'',
                    endDate:that.timeDate?that.timeDate[1]:'',
                 }
            }).then(response=>{
                let arrData=response.dtData;
                arrData.map((value)=>{
                    value.expand=null
                })
                that.tableData=arrData;
                that.total =parseInt(response.dtData[0].TotalCount);
                that.loading=false
            }).catch(data=>{
                that.loading=false
            })
        },

    },
    mounted:function(){
        let that=this;
        let now = new Date();
        let nowTime = now.getTime() ;
        let day = now.getDay();
        if(day==0){     //西方从周日算为第一天    2018/10/28
            day=7
        }
        let oneDayLong = 24*60*60*1000 ;
        let MondayTime = nowTime - (day-1)*oneDayLong  ;
        let SundayTime =  nowTime + (7-day)*oneDayLong ;
        let monday = dateForm(new Date(MondayTime));
        let sunday = dateForm(new Date(SundayTime));
        that.timeDate= [
            monday,
            sunday
        ];   //初始化时间范围
        that.getList()
        that.GetCommunityDistrict()
    }
  }
function addZero(s){
    return s < 10 ? '0' + s: s;
}
function dateForm(data){
    return   new Date(data).getFullYear()+'-'+addZero((new Date(data).getMonth()+1))+'-'+addZero(new Date(data).getDate())
}
</script>
<style scoped lang="scss">
   .iconImg{
       width: 30px;
       height: auto;
       display:inline-block;
   }
   .click_line{cursor: pointer;color:#409EFF;}
</style>
